<template>
  <view class="content">
    <law-index-nav @openCoupons="openCoupons"></law-index-nav>
<!--    <view class="index-rights" @click="openRights()" v-if="rightsStatue">-->
<!--      <image class="rights-img" src="@/static/img/index-notice1.png" mode="heightFix"></image>-->
<!--      <view class="rights-txt">“为免影响您的权益，请点击此处，一一开启新消息通知”</view>-->
<!--      <image class="rights-img" src="@/static/img/index-notice2.png" mode="heightFix"></image>-->
<!--    </view>-->
    <!-- 	<view class="index-rights" v-if="showCard" @click="openCard(1)">
        <image class="rights-img" src="@/static/img/index-notice1.png" mode="heightFix"></image>
        <view class="rights-txt">“请补充律师认证信息，以便继续接单”</view>
        <image class="rights-img" src="@/static/img/index-notice2.png" mode="heightFix"></image>
      </view> -->
    <!-- <view class="index-rights" v-if="showInfo" @click="openCard(2)">
      <image class="rights-img" src="@/static/img/index-notice1.png" mode="heightFix"></image>
      <view class="rights-txt">“请点击完善个人能力，吸引更多用户委托您”</view>
      <image class="rights-img" src="@/static/img/index-notice2.png" mode="heightFix"></image>
    </view> -->
    <view class="sticky">
      <law-search :searchData="searchData"></law-search>
    </view>
    <law-nav shouye="true"></law-nav>
    <!-- 服务领域 -->
    <view class="service-area-box" v-if="serveAreaList">
      <view class="second-txt" v-for="(item, index) in serveAreaList" @click="jump('/pages/client/index/list', { server_id: item.id })">
        <image :src="item.area_image" class="area-image" mode="widthFix"></image>
        <text class="area-txt">{{ item.area_name }}</text>
      </view>
    </view>

    <!-- 消息列表 -->
    <view class="notice-index-box" @click="jump('/pages/client/index/notice')">
      <view class="notice-index-left">
        <view class="bottom-right">
          <view class="item-txt">订单和通知</view>
          <view class="item-time">
            <view class="lookmore gray">查看详情</view>
            <view class="rightarrow">
              <view class="bottom-raidus" v-if="notice_status == 1"></view>
              <view class="bottom-arrow" style="margin-top: 2rpx"><image src="@/static/img/gray-right-arrow.png" mode="widthFix"></image></view>
            </view>

          </view>
        </view>
        <view class="notice-index-item" v-for="(item, index) in infoNotices.notice">
          <view class="item-txt"><view class="width60" :style="item.time?'':'width:100%'">{{ item.title }}</view></view>
          <view class="item-time gray">{{ item.time }}</view>
        </view>
      </view>
    </view>
    <!-- 轮播图-->
    <swiper
        class="swiper-banner"
        :indicator-dots="true"
        :autoplay="true"
        interval="5000"
        duration="1000"
        :circular="true"
        indicator-color="rgba(255,255,255,0.5)"
        indicator-active-color="#FFC801"
    >
      <swiper-item v-for="(item, index) in bgBanner" :key="item.id">
        <view class="banner">
          <view class="image-wrapper" @click="goInvite(item)">
            <view :style="{ 'background-image': 'url(' + item.image + ')' }" style="height: 190rpx; background-size: 100% 100%; "></view>
          </view>
        </view>
      </swiper-item>
    </swiper>
    <view class="jiedanzhiyin" v-if="userInfo.is_weituo != '1'" @click="runZhiyin()">
      <view class="jiedan_left">
        <image src="@/static/img/jiedanzhiyin@2x.png" class="jiedan-img"></image>
        <view class="jiedan-content">
          <view class="jiedan-top">接单指引</view>
          <view class="jiedan-subtitle">助您轻松接单，快速结款</view>
        </view>
      </view>
      <view class="jiedan_right">
        查看
      </view>
    </view>
    <template v-if="userInfo.is_weituo == '1'">
      <view class="hot-box">
        <view class="hot-title">
          <image class="hot-fire" src="@/static/img/fire.png" mode="widthFix"></image>
          <text class="hot-txt">热销推荐</text>
        </view>
        <waterfall v-if="info.product" :col="col" :data="info.product" :gutterWidth="gutterWidth" :width="itemWidth">
          <template>
            <div class="cell-item" v-for="(item, index) in info.product" @click="navTo(item)">
              <view class="item-img" @click.stop="previewImage(item)">
                <image v-if="item.product_image" :src="item.product_image" alt="加载错误" mode="widthFix"></image>
                <view class="address">
                  <view class="address-v">
                    <view class="year-icon">
                      <image src="../../../static/img/year.png" class="" mode=""></image>
                    </view>
                    <view class="year-name" v-if="item.serve_name!='全部'" style="margin-left: 10rpx;">{{item.serve_name}}</view>
                    <view class="year-names" v-if="item.serve_name=='全部'" style="margin-left: 10rpx;">{{item.serve_name}}</view>
                  </view>
                  <view class="address-v">
                    <view class="address-icon">
                      <image src="../../../static/img/addresss.png" class="" mode=""></image>
                    </view>
                    <view class="address-name" style="margin-left: 10rpx;">{{item.profession}}</view>
                  </view>
                </view>
              </view>
              <view class="item-txt u-p-l-12 u-p-r-12">

                <law-product-intror-nopay2 :item="item" :index="true"></law-product-intror-nopay2>
                <!-- 服务保障 -->
                <view class="item-tag text-ellipsis" style="    display: flex;">

                  <text class="tag-txt  tag-txt-small" :class="small ? 'label-txt-anzhuo-small' : ''" v-for="(item_tag, index_tag) in item.tags"  :style="{'margin-left':index_tag==0?'0rpx':(item.product_name=='打官司'&&!small?'-30rpx':'-40rpx')}" >{{ item_tag }}</text>
                </view>
<!--                &lt;!&ndash; 价格 &ndash;&gt;-->
<!--                <view class="item-money">-->
<!--                  <view class="item-give">-->
<!--                    <text v-if="String(item.product_money).indexOf('*') > 0" :style="(String(item.product_huaxian_money).indexOf('(')>0||String(item.product_huaxian_money).indexOf('随缘')>-1)||String(item.product_money).indexOf('*') > 0?'margin-right: 0;display:block;':'margin-right: 16rpx;'">-->
<!--                      <text class="item-fuhao">¥</text>-->
<!--                      <text>{{ item.product_money.split('*')[0] }}</text>-->
<!--                      <text  class="item-fq">x{{ item.product_money.split('*')[1] }}</text>-->
<!--                    </text>-->
<!--                    <text v-else :style="(String(item.product_huaxian_money).indexOf('(')>0||String(item.product_huaxian_money).indexOf('随缘')>-1)||String(item.product_money).indexOf('*') > 0?'margin-right: 0;display:block;':'margin-right: 16rpx;'">-->
<!--                      <text class="item-fuhao">¥</text>-->
<!--                      <text >{{ item.product_money }}</text>-->
<!--                    </text>-->
<!--                    <template v-if="item.product_huaxian_money&&(item.product_name != '问一下'&&item.offer!='47')">-->
<!--                      <text  style="margin-left:0"  v-if="String(item.product_huaxian_money).indexOf('(')>0" class="coupon-prize line_through">{{ '¥'+  String(item.product_huaxian_money).slice(0,String(item.product_huaxian_money).indexOf('('))}}<span style="font-size:20rpx">(投资人支付)</span></text>-->
<!--                      <text  style="margin-left:0"  v-else class="coupon-prize line_through">{{ '¥'+  item.product_huaxian_money}}</text>-->
<!--                    </template>-->
<!--                  </view>-->
<!--                  <view class="money-right gray">-->
<!--                    <view class="money-num">已售{{ item.sale }}</view>-->
<!--                  </view>-->
<!--                </view>-->

                <!-- 价格 -->
                <view class="item-money">
                  <view class="item-give" :class="String(item.product_money).indexOf('*') > 0||item.price_type=='50'||String(item.product_money).indexOf('(投资人支付') > 0||String(item.product_money).indexOf('+') > 0?'item-gives':''">
                    <text v-if="(String(item.product_money).indexOf('*') > 0||item.price_type=='50')&& String(item.product_money).indexOf('(投资人支付') < 0" :style="
                      String(item.product_huaxian_money).indexOf('(') > 0 ||
                      String(item.product_huaxian_money).indexOf('随缘') > -1 ||
                      String(item.product_money).indexOf('*') > 0
                        ? 'margin-right: 0;display:block; position:relative'
                        : 'margin-right:0;display:block; position:relative'
                    ">
                      <text class="item-fuhao">¥</text>
                      <block v-if="String(item.product_money).indexOf('*') > 0">
                        <text class="item-yuanshi">{{ item.product_money.split("*")[0] }}</text>
                        <text class="item-fq" style="top: 1px">x{{ item.product_money.split("*")[1] }}</text>
                      </block>
                      <block v-else><text class="item-yuanshi">{{item.product_money}}</text><text class="textnormal item-fq"  :style="small ?'top: 6rpx':'top: 6rpx'"  :class="small ?'xia_as' : 'xia_bs'">
											(先用后付)
											</text></block>
                    </text>
                    <view v-else-if="
                      String(item.product_money).indexOf('(投资人支付') > 0
                    " :style="
                      String(item.product_huaxian_money).indexOf('(') > 0 ||
                      String(item.product_huaxian_money).indexOf('随缘') > -1 ||
                      String(item.product_money).indexOf('*') > 0
                        ? 'margin-right: 0;position:relative'
                        : 'margin-right: 16rpx; position:relative'
                    " style="">
                      <view>
                        <text class="item-fuhao">¥</text>
                        <text class="item-yuanshi">{{
                            item.product_money.split("(投资人支付")[0]
                          }}</text>
                        <text class="textnormal item-fq"
                              :style="small ?'top: 6rpx':'top: 6rpx'"
                              :class="small ?'xia_as' : 'xia_bs'">(投资人支付)</text>
                      </view>

                    </view>
                    <text v-else :style="
                      String(item.product_huaxian_money).indexOf('(') > 0 ||
                      String(item.product_huaxian_money).indexOf('随缘') > -1 ||
                      String(item.product_money).indexOf('*') > 0
                        ? 'margin-right: 0;display:block; position:relative'
                        : 'margin-right: 0;display:block; position:relative'
                    ">
                      <text class="item-fuhao">¥</text>
                      <text class="item-yuanshi">{{ item.product_money }}</text>
                    </text>
                    <template v-if="
                      item.product_huaxian_money &&
                       ((item.product_name == '问一下'&&item.serve_time!='15分钟')||item.product_name != '问一下')  &&
                      item.offer != '47'
                    ">
                      <text style="margin-left: 0;display: inline-block; position:relative"
                            v-if="String(item.product_huaxian_money).indexOf('(') > 0"
                            class="coupon-prize line_through">
                        <text  class="item-fq">{{"¥" + String(item.product_huaxian_money).slice(
                              0,
                              String(item.product_huaxian_money).indexOf("(")
                          )}}</text>
                        <text class="teshus item-fq"  style="top:-4rpx"  :class="small ? 'xia_a' : 'xia_b'">
                          (投资人支付)
                        </text>
                      </text>
                      <text style="margin-left: 0; position:relative" v-else-if="(String(item.product_huaxian_money).indexOf('*') > 0||item.price_type=='50')&& String(item.product_huaxian_money).indexOf('(投资人支付') < 0"
                            class="coupon-prize line_through">
                        <block v-if="String(item.product_huaxian_money).indexOf('*') > 0">
                          <text  class="item-fq">{{"¥" + item.product_huaxian_money.split("*")[0] }}</text>
                          <text class="item-fq" :class="small? 'xia_a' : 'xia_b'"  :style="small?'top:1px':'top: 0px'" >x{{ item.product_huaxian_money.split("*")[1] }}</text>
                        </block>
                        <block v-else><text class="item-fq">{{"¥" +item.product_huaxian_money}}</text><text class="teshus item-fq"  :style="small?'top:-1px':'top:-2px'"  :class="small ? 'xia_a' : 'xia_b'">
											(先用后付)
											</text></block></text>
                      <text style="margin-left: 0; position:relative" v-else class="coupon-prize line_through">{{ "¥" + item.product_huaxian_money }}</text>
                    </template>
                  </view>
                  <view class="money-right gray">
                    <view class="money-num">已售{{ item.sale }}</view>
                  </view>
                </view>

                <!-- 标题 -->
                <!--								<view-->
                <!--									class="item-title"-->
                <!--									@click.stop="-->
                <!--										item.isEllipsis = !item.isEllipsis;-->
                <!--										copy(item);-->
                <!--									"-->
                <!--								>-->
                <!--									<image class="title-image" src="@/static/img/product-title.png" mode="widthFix"></image>-->
                <!--									<view class="title-txt" :class="{ 'txt-one-list': item.isEllipsis == true }">{{ item.title }}</view>-->
                <!--									<view-->
                <!--										class="title-arrow"-->
                <!--										:class="{ rotate: item.isEllipsis == true }"-->
                <!--										v-if="item.title && item.title.replace(/[\u0391-\uFFE5]/g, 'aa').length > 14"-->
                <!--									>-->
                <!--										&lt;!&ndash; <image src="@/static/img/order-top-arrow.png" mode="aspectFit"></image> &ndash;&gt;-->
                <!--									</view>-->
                <!--								</view>-->
              </view>
            </div>
          </template>
        </waterfall>
        <!-- <view class="ok-box padding0"><button type="default" class="ok-btn" @click="checkAll()">查看全部服务</button></view> -->
      </view>
      <law-ad></law-ad>
    </template>
    <!-- 我要接单 -->
    <template v-else-if="userInfo.is_weituo != '1'">
      <view class="order-list-box" style="margin-top: 30rpx;">
        <view class="order-item" v-for="(item, index) in dataList">
          <!--          {{item}}-->
          <view class="item-img item-imgs">
            <view class="image-wrapper"><image :src="item.product_image" mode="aspectFit"></image></view>
            <view class="item-pro-name">{{ item.product }}</view>
          </view>
          <view class="item-txt">
            <view class="item-order">
              <text class="order-txt text-ellipsis">订单号：{{ item.order_sn }}</text>
              <view class="item-link text-ellipsis">
                <text
                    style="display: none"
                    class="tip-link"
                    @click.stop="
										desc_content = item.serve_desc;
										price_type = item.price_type
										product_id = item.product_id
										$refs.popupEnsure.open();
									"
                >
                  产品说明
                </text>
                <text class="tip-link" v-if="((item.source && item.source.length > 0)||item.card_images||item.liaotian_images||item.jietiao_images||item.cuishou_images||item.other_images||item.huan_images)&&userInfo.is_lawyer">
                  <text class="tip-link"
                        v-if="item.self_ident=='32'"
                        @click="jump('/pages/client/order/project-data-info2', {zanzhuzheng_doc:item.zanzhu, card_images: item.card_images,liaotian_images:item.liaotian_images,jietiao_images: item.jietiao_images,cuishou_images:item.cuishou_images,other_images:item.other_images,huan_images:item.huan_images,type:item.price_type=='自费'? 2 : 1,id:item.id,isshou:'1',shenfen_images:item.shenfen_images,zanzhuzheng_doc:item.zanzhu, })"
                  >
                    查看资料
                  </text>
                  <text v-else class="tip-link" @click="jump('/pages/client/order/upload', { source: JSON.stringify(item.source),readOnly:true,isshou:'1'})">
                    查看资料
                  </text>
                </text>

              </view>
            </view>
            <law-product-intro2 :item="item" :isshou="1" :isProtect="true" :userInfo="userInfo"></law-product-intro2>
            <order-list-other2 :item="item" :isshou="1"  :isProtect="true" :userInfo="userInfo"></order-list-other2>
            <view class="service-list"><button class="service-item active" style="width: 400rpx; margin:0px 5%;" @click.stop="iWant(item)">我要接单</button></view>
          </view>

        </view>
        <uni-load-more
            :status="loadingType"
            :contentText="{
						contentdown: '上拉显示更多',
						contentrefresh: '正在加载...',
						contentnomore: '新订单正在来的路上，请稍等'
					}"
        ></uni-load-more>
      </view>
    </template>
    <!-- 产品说明弹出层 -->
    <uni-popup ref="popupEnsure" type="center">
      <order-popup-common title="产品说明" @closePop="closePop('popupEnsure')">
        <scroll-view class="popup-con" scroll-y="true" slot="popup-con">
          <view style="padding:0 30rpx;" v-if="userInfo.is_lawyer == '1' && product_id == 6">
            <lawyer-zf v-if="price_type == '自费'"></lawyer-zf>
            <lawyer-tzr v-else></lawyer-tzr>
          </view>
          <view style="padding:0 30rpx;" v-else-if="userInfo.is_fawu == 1">
            <!--  v-if="price_type == '自费'" -->
            <law-work-zf></law-work-zf>
            <!-- <law-work-tzr v-else></law-work-tzr> -->
          </view>
          <view style="padding:0 30rpx;" v-else>
            <image :src="desc_content" mode="widthFix" style="width: 100%"></image>
          </view>
        </scroll-view>
        <view class="ok-box" slot="popup-btn"><button type="default" class="ok-btn" @click="closePop('popupEnsure')">朕知道了</button></view>
      </order-popup-common>
    </uni-popup>

    <!-- 我要接单弹出层 -->
    <uni-popup ref="popupWantOrder" type="dialog">
      <uni-popup-dialog type="info" title="温馨提示" okTxt="确定" cancleTxt="取消" :before-close="true" @confirm="receiveOrder" @close="closePop('popupWantOrder')">
        <template v-if="current_item.product == '问一下' && current_item.serve_time == '15分钟'">
          <view>我确认接单</view>
        </template>
        <template v-else>
          <view class="warm-tip-box">
            <view class="warm-tip-item">
              <view class="item-left"> </view>
              <view class="item-right" v-if="userInfo.is_fawu== 1">请务必在接单后1分钟内，先联系下委托人，避免委托人长时间等待，产生情绪。</view>
            </view>
            <view class="item-right"v-if="userInfo.is_lawyer== 1">
              <view>请在接单后15分钟内:</view>
              <view style="text-align: justify;padding: 10rpx 0;line-height: 48rpx;">1.审查案件是否在您的执业区域内。如不在，请指引委托人按解除委托办理。</view>
              <view style="padding: 0rpx 0">2.审查是否有利益冲突。</view></view>
          </view>
        </template>
      </uni-popup-dialog>
    </uni-popup>
    <!-- 我要接单弹出层投资人支付专用-->
    <uni-popup ref="popupWantOrder2" type="dialog">
      <uni-popup-dialog type="info" title="温馨提示" okTxt="是" cancleTxt="否" :before-close="true" @confirm="receiveOrder" @close="closePop('popupWantOrder2')">
        <template v-if="current_item.product == '问一下' && current_item.serve_time == '15分钟'">
          <view>我确认接单</view>
        </template>
        <template v-else>
          <view class="warm-tip-box">
            <view class="warm-tip-item">
              <view class="item-left"> </view>
              <view class="item-right" v-if="userInfo.is_fawu== 1">请务必在接单后1分钟内，先联系下委托人，避免委托人长时间等待，产生情绪。</view>
            </view>
            <view class="item-right" v-if="userInfo.is_lawyer== 1">
              <!-- <view>请在接单后15分钟内:</view> -->
              <!-- <view style="text-align: justify;padding: 10rpx 0;line-height: 48rpx;">1.审查案件是否在您的执业区域内。如不在，请指引委托人按解除委托办理。</view> -->
              <view style="padding: 0rpx 0">我确认与本案当事人没有利益冲突。</view>
            </view>
          </view>
        </template>
      </uni-popup-dialog>
    </uni-popup>
    <!-- 我要接单弹出自费专用-->
    <uni-popup ref="popupWantOrder3" type="dialog">
      <uni-popup-dialog type="info" title="温馨提示" okTxt="是" cancleTxt="否" :before-close="true" @confirm="receiveOrder" @close="closePop('popupWantOrder3')">
        <template v-if="current_item.product == '问一下' && current_item.serve_time == '15分钟'">
          <view>我确认接单</view>
        </template>
        <template v-else>
          <view class="warm-tip-box">
            <view class="warm-tip-item">
              <view class="item-left"> </view>
              <view class="item-right" v-if="userInfo.is_fawu== 1">请务必在接单后1分钟内，先联系下委托人，避免委托人长时间等待，产生情绪。</view>
            </view>
            <view class="item-right" v-if="userInfo.is_lawyer== 1">
              <view>我确认：</view>
              <view style="text-align: justify;padding: 10rpx 0;line-height: 48rpx;">1、 我与本案/各方当事人没有利害冲突。</view>
              <view style="padding: 0rpx 0">{{ current_item.is_yidi=='1'?'2、 我愿意异地出差办案（差旅费用由委托人承担）':'2、 本案在我的执业区域以内。'}}</view>
            </view>
          </view>
        </template>
      </uni-popup-dialog>
    </uni-popup>
    <!--    抢单动画 -->
    <uni-popup ref="popupWantOrder4" type="dialog">
      <uni-popup-dialog type="info" title="" okTxt="" cancleTxt="" @close="closePop('popupWantOrder4')"  class="dialog-toast-loading">
        <template>
          <view class="loading-run">
            <image class="loading-gif" src="@/static/img/loadings.gif"></image>
            <view class="loading-text">抢单中…</view>
          </view>
        </template>
      </uni-popup-dialog>
    </uni-popup>
    <!--    抢到单动画 -->
    <uni-popup ref="popupWantOrder5" type="dialog">
      <uni-popup-dialog type="info" title="" okTxt="" cancleTxt="" @close="closePop('popupWantOrder5')"  class="dialog-toast">
        <template>
          <view class="loading-run">
            <image class="loading-gif loading-gif-success" src="@/static/img/getsuccess@2x.png"></image>
            <view class="loading-text">抢单成功…</view>
          </view>
        </template>
      </uni-popup-dialog>
    </uni-popup>
    <!--    没抢到单动画 -->
    <uni-popup ref="popupWantOrder6" type="dialog">
      <uni-popup-dialog type="info" title="" okTxt="" cancleTxt="" @close="closePop('popupWantOrder6')" class="dialog-toast">
        <template>
          <view class="loading-run">
            <image class="loading-gif loading-gif-fail"  src="@/static/img/getfail@2x.png"></image>
            <view class="loading-text">哎呀，手慢了</view>
            <view class="loading-text">快去看看其他订单吧</view>
          </view>
        </template>
      </uni-popup-dialog>
    </uni-popup>
    <!-- 领取优惠券弹出层 -->
    <uni-popup ref="popupCoupons" type="center">
      <view class="coupons-index-box">
        <view class="coupons-txt" v-if="current_coupon.coupon_type == 1">
          <view class="txt-tip">恭喜获得</view>
          <view class="txt-tip">1000元新人优惠券</view>
          <view class="img2"><image src="@/static/img/index-ic2.png" mode=""></image></view>
        </view>
        <view class="coupons-txt" v-else>
          <view class="txt-tip">恭喜获得{{ current_coupon.coupon_count }}张</view>
          <view class="txt-tip">{{ current_coupon.coupon_name }}</view>
          <view class="img2"><image src="@/static/img/index-ic20.png" mode=""></image></view>
        </view>

        <view class="img3" @click="gotoShoplist()"><image src="@/static/img/index-ic3.png" mode="widthFix"></image></view>
        <view class="img3" @click="runtoMyCoupons()"><image src="@/static/img/lookmore.png" mode="widthFix"></image></view>
        <view class="item-txt">可在“我的”—“钱包”里查看优惠卷</view>
        <view class="img4" @click="closeGetCoupons()"><image src="@/static/img/index-ic4.png" mode="widthFix"></image></view>
      </view>
    </uni-popup>
  </view>
</template>

<script>
import { mapGetters, mapMutations } from 'vuex';
import uniCopy from '@/common/utils/js_sdk/xb-copy/uni-copy.js';
import $ from 'jquery'
export default {
  data() {
    return {
      current_item: '',
      desc_content: '', //产品说明
      page: 1, //分页加载
      loadingType: 'more', //加载更多状态
      dataList: [],
      wantOderContent: '',
      current_coupon: '', //优惠券类型
      ifOnShow: false, //返回时刷新
      info: '', //首页信息
      from: '',
      rightsStatue: true, //开启新消息通知，
      serveAreaList: [],
      hoteList: [],
      col: 2,
      infoNotices: '',
      showCard: false, //开启补充身份信息认证
      showInfo: false ,//开启未认证提醒
      token: uni.getStorageSync('token'),
      notice_status: 0,
      price_type:'自费',
      small: false,
      product_id:'',
      searchData:[
          {
            "name": "咨询小问题、简单问题，点问一下，选15分钟",
            "id": "ss1"
          },
          {
            "name": "咨询官司能否打赢，点问一下，选包月",
            "id": "ss2"
          },
          {
            "name": "外出办事，要律师帮您防坑防骗壮声势，点陪同办",
            "id": "ss3"
          },
          {
            "name": "人家告您，要律师帮您打赢或减少赔偿，点打官司",
            "id": "ss4"
          },
          {
            "name": "您告人家，要律师帮您打赢、回款，点打官司",
            "id": "ss5"
          },
          {
            "name": "亲朋好友被抓，要律师带话、取保，点刑事会见",
            "id": "ss6"
          }
        ],
    };
  },
  created() {
    // 安卓
    window.isRightsOk = this.isRightsOk;
    const nav = navigator.userAgent;
    if (nav.indexOf("Android") > -1 || nav.indexOf("Adr") > -1) {
      this.small = true;
    } else if (!!nav.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)) {
      this.is_anzhuo = false;
    }
  },
  computed: {
    ...mapGetters(['userInfo', 'navProduct', 'bgBanner']),
    itemWidth() {
      return 345 * 0.5 * (document.documentElement.clientWidth / 375); //#rem布局 计算宽度
    },
    gutterWidth() {
      return 20 * 0.5 * (document.documentElement.clientWidth / 375); //#rem布局 计算x轴方向margin(y轴方向的margin自定义在css中即可)
    }
  },
  onHide() {
    this.ifOnShow = true;
    this.gettopColor();
    $(document.body).css({'background-color':'#f6f6f6'})
  },
  onShow() {
    $(document.body).css({'background-color':'#fafcfa'})
    this.gettopNewColor();
    if (this.ifOnShow) {
      this.initOnce();
      // 切换账户时，获取登录信息
      if (this.from == 'login') {
        this.init();
        this.getStatus();
      } else {
        const nav = navigator.userAgent;
        if (nav.indexOf('Android') > -1 || nav.indexOf('Adr') > -1) {
          let res = phone.loadUserInfo();
          uni.setStorageSync('token', JSON.parse(res).data.userinfo.token);
          this.in_login(JSON.parse(res).data.userinfo);
          this.init();
          this.getStatus();
        } else if (!!nav.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)) {
          this.$bridge.callhandler('loadUserInfo', {}, res => {
            uni.setStorageSync('token', res.token);
            this.in_login(res);
            this.init();
            this.getStatus();
          });
        }
      }
      this.closePop('popupWantOrder');
      this.closePop('popupWantOrder2');
      this.closePop('popupWantOrder3');
    }
  },
  onLoad(params) {
    this.initOnce();
    // 获取登录信息
    if (params.from == 'login') {
      this.from = 'login';
      this.init();
      this.getStatus();
    } else {
      const nav = navigator.userAgent;
      if (nav.indexOf('Android') > -1 || nav.indexOf('Adr') > -1) {
        let res = phone.loadUserInfo();
        uni.setStorageSync('token', JSON.parse(res).data.userinfo.token);
        this.in_login(JSON.parse(res).data.userinfo);
        this.init();
        this.getStatus();
      } else if (!!nav.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)) {
        this.$bridge.callhandler('loadUserInfo', {}, res => {
          uni.setStorageSync('token', res.token);
          this.in_login(res);
          this.init();
          this.getStatus();
        });
      }
    }
  },
  methods: {
    ...mapMutations(['setNavProduct', 'in_login', 'setBgBanner']),
    handleTouchMove(event){
      // event.preventDefault()
    },
    runZhiyin(){
      if(this.userInfo.is_fawu== 1){
        this.jump('/pages/client/index/fawu-jiedan');
      }else if(this.userInfo.is_lawyer== 1){
        this.jump('/pages/client/index/lawyer-jiedan');
      }
    },
    async initOnce() {
      var that = this;
      that.$api('index.index').then(res => {
        that.info = res.data;
        uni.setStorageSync('ad', that.info.fali.bottom_msg); //广告
        that.setBgBanner(that.info.bg_banner); //轮播图
        that.setNavProduct(that.info.top_category); //七个产品
        // if(!uni.getStorageSync('searchData')){
        //   that.searchData = uni.getStorageSync('searchData');
        // }else{
        //   that.searchData = that.info.intro
        // }
        uni.setStorageSync('searchData', that.info.intro); //搜索提示语

        that.$api('index.serveArea').then(res => {
          that.serveAreaList = res.data;
        });
        that.info.product.forEach(item => {
          that.$set(item, 'isEllipsis', true);
        });
      });
      let formData = {
        page: that.page,
        token: uni.getStorageSync('token')
      };
      let res = await that.$api('index.able', formData);
      if (res.code == 1&&res.data) {
        that.infoNotices = res.data;
      }
    },
    getStatus() {
      if(uni.getStorageSync('isToast')){
        uni.showToast({
          title:'您可在“我的–个人信息”里修改个人能力',
          icon:'none',
          duration:5000
        })
        uni.removeStorageSync('isToast')
      }

      let tokenData = {
        token: uni.getStorageSync('token')
      };
      this.$api('index.tips', tokenData).then(res => {
        if (res.data.is_lawyer_tips == 1 && res.data.is_read == 0) {
          this.showInfo = true;
        } else if (res.data.is_lawyer_tips == 2) {
          this.showCard = true;
        } else {
          this.showInfo = false;
          this.showCard = false;
        }
      });
    },
    openCard(type) {
      if (type == 1) {
        uni.navigateTo({
          url: '../../service/uploadCard/uploadCard'
        });
      } else {
        this.$api('index.tips', { token: uni.getStorageSync('token'), tips: 1 }).then(res => {
          uni.setStorageSync('isToast',true)
          uni.navigateTo({
            url: '../../service/lawyerAuth/lawyerAuth'
          });
        });
      }
    },
    async init() {
      let formData = { token: uni.getStorageSync('token') };
      // 认证为律师后，重新获取用户信息。每次进入都重新获取用户信息
      this.$api('index.user', formData).then(res => {
        this.in_login(res.data.user);
      });
      this.initCoupons();
      this.loadData('refresh');
      // 进入页面判断消息栏的状态是否开启 IOS不显示
      const nav = navigator.userAgent;
      if (nav.indexOf('Android') > -1 || nav.indexOf('Adr') > -1) {
        let res = phone.notificationPermission();
        console.log(res,'-----方法返回值')
        if(res == '0'){
          // 有权限
          this.rightsStatue = false
        }else{
          // 无权限
          this.rightsStatue = true
        }
      } else if (!!nav.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)) {
        this.rightsStatue = false;
      }
      console.log(this.rightsStatue,'------this.rightsStatue')
    },
    //判断是否开启新消息通知iOS没有回执，自动隐藏
    isRightsOk() {
      // this.rightsStatue = false;

      let res = phone.notificationPermission();
      console.log(res,'-----方法返回值')
      if(res == '0'){
        // 有权限
        this.rightsStatue = false
      }else{
        // 无权限
        this.rightsStatue = true
        uni.showToast({
          title: `您可在“我的–设置–新消息通知”里，重新设置通知。`,
          icon: 'none',
          duration: 5000
        });
      }
    },
    async initCoupons() {
      let formData = {
        token: uni.getStorageSync('token')
      };
      let res = await this.$api('index.is_coupon', formData);
      for (let i = 0; i < res.data.length; i++) {
        if (res.data[i].status == 0) {
          this.current_coupon = res.data[i];
          this.$refs.popupCoupons.open();
          break;
        }
      }
    },
    async closeGetCoupons() {
      this.$refs.popupCoupons.close();
      let formData = {
        token: uni.getStorageSync('token'),
        type: 1,
        coupon_type: this.current_coupon.coupon_type
      };
      let res = await this.$api('index.is_coupon', formData);
      this.initCoupons();
    },
   async runtoMyCoupons(){
      let formData = {
        token: uni.getStorageSync('token'),
        type: 1,
        coupon_type: this.current_coupon.coupon_type
      };
      let res = await this.$api('index.is_coupon', formData);
      this.jump('/pages/client/user/my_coupon');
    },
    async gotoShoplist(){
      let formData = {
        token: uni.getStorageSync('token'),
        type: 1,
        coupon_type: this.current_coupon.coupon_type
      };
      let res = await this.$api('index.is_coupon', formData);
      if(this.current_coupon.product_id){
        uni.navigateTo({
          url: `/pages/client/index/list?id=${this.current_coupon.product_id}`,
        });
      }else{
        uni.navigateTo({
          url: `/pages/client/index/searchlist?searchId=ss7`,
        });
      }
    },
    //带下拉刷新和上滑加载
    async loadData(type = 'add', loading) {
      if (type === 'add') {
        if (this.loadingType === 'nomore') {
          return;
        }
        this.loadingType = 'loading';
      } else if (type === 'refresh') {
        this.loadingType = 'loading';
        this.page = 1;
        this.dataList = [];
      } else {
        this.loadingType = 'more';
      }

      let formData = {
        page: this.page,
        token: uni.getStorageSync('token')
      };
      let res = await this.$api('index.able', formData);
      if (res.code == 1) {
        this.infoNotices = res.data;
        let dataList = res.data.able_order;
        this.page++;
        this.dataList = this.dataList.concat(dataList);
        this.loadingType = res.data.current_page >= res.data.total_page ? 'nomore' : 'more';
        this.info = res.data;
        this.notice_status = res.data.notice_status;
      }
    },
    goInvite(item) {
      if (item.title == '邀请好友') {
        this.jump('/pages/client/user/invite');
      } else if (item.title == '身份认证') {
        const nav = navigator.userAgent;
        if (nav.indexOf('Android') > -1 || nav.indexOf('Adr') > -1) {
          phone.identityAuthentication();
        } else if (!!nav.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)) {
          this.$bridge.callhandler('identityAuthentication', {}, res => {});
        }
      }
    },
    iWant(item) {
      this.current_item = item;
      if(this.current_item.price_type == '投资人支付(不用还)'){
        this.$refs.popupWantOrder2.open();
      }else if(this.current_item.price_type == '自费'){
        this.$refs.popupWantOrder3.open();
      }else {
        this.$refs.popupWantOrder.open();
      }

    },
    async receiveOrder() {
      //法务
      if (this.userInfo.is_fawu == '1') {
        let formData = {
          token: uni.getStorageSync('token'),
          id: this.current_item.id
        };
        let res = await this.$api('index.f_getOrder', formData);
        if (res.code == 1) {
          this.closePop('popupWantOrder');
          let item = this.current_item;
          this.jump('/pages/specialist/user/service-specialist', { order_id: item.id, status: item.status });
        }
      }else if (this.userInfo.is_lawyer== 1) { //律师
        this.$refs.popupWantOrder4.open();
        let formData = {
          token: uni.getStorageSync('token'),
          id: this.current_item.id
        };
        let res = await this.$api('index.l_getOrder', formData);
        if (res.code == 1) {
          this.closePop('popupWantOrder');
          this.closePop('popupWantOrder2');
          this.closePop('popupWantOrder3');
          setTimeout(()=>{
            this.closePop('popupWantOrder4');
            this.$refs.popupWantOrder5.open();
          },2000)
          setTimeout(()=>{
           this.lawyerGetorder()
          },7000)
        }else{
          this.closePop('popupWantOrder');
          this.closePop('popupWantOrder2');
          this.closePop('popupWantOrder3');
          setTimeout(()=>{
            this.closePop('popupWantOrder4');
            this.$refs.popupWantOrder6.open();
          },2000)
          setTimeout(()=>{
            this.closePop('popupWantOrder6');
            this.init()
          },7000)
        }
      }
    },
    async lawyerGetorder(){
        this.closePop('popupWantOrder');
        this.closePop('popupWantOrder2');
        this.closePop('popupWantOrder3');
        this.closePop('popupWantOrder5');
        this.closePop('popupWantOrder6');
        let item = this.current_item;
        if (item.serve_time == '15分钟') {
          this.jump('/pages/lawyer/user/service-minute', { order_id: item.id, status: item.status });
        } else if (item.serve_time == '连续包月') {
          this.jump('/pages/lawyer/user/service-month', { order_id: item.id, status: item.status });
        } else if (item.serve_time == '包年') {
          this.jump('/pages/lawyer/user/service-year', { order_id: item.id, status: item.status });
        } else if (item.price_type == '投资人支付(不用还)') {
          this.jump('/pages/lawyer/user/service-investor', { order_id: item.id, status: item.status });
        } else if (item.price_type == '自费') {
          this.jump('/pages/lawyer/user/service-zifei', { order_id: item.id, status: item.status });
        } else {
          this.jump('/pages/lawyer/user/service-face', { order_id: item.id, status: item.status });
        }
    },
    openCoupons() {
      this.initCoupons();
    },
    // 开启新消息通知
    openRights() {
      const nav = navigator.userAgent;
      if (nav.indexOf('Android') > -1 || nav.indexOf('Adr') > -1) {
        phone.openNotificationSettings();
      } else if (!!nav.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)) {
        this.$bridge.callhandler('openNotificationSettings', {}, data => {});
      }
    },
    navTo(item) {
      let url = '';
      if(item.product_price_id=='355'){
        item.product_price_id = "354"
      }
      let params = {
        product_id: item.product_price_id,
        product_name: item.product_name,
        area_id: item.id,
        sale:item.sale,
        serve_name_text:"全部年限",
        price_type_text:item.price_type,
        product_price_id:item.product_price_id,
      };

      if (item.product_name == '问一下') {
        url = '/pages/client/order/order-ask';
      } else if (item.product_name == '写合同') {
        url = '/pages/client/order/order-write';
      } else if (item.product_name == '陪同办') {
        url = '/pages/client/order/order-chat';
      } else if (item.product_name == '私人律师') {
        url = '/pages/client/order/order-butler';
      } else if (item.product_name == '审案子') {
        url = '/pages/client/order/order-decide';
      } else if (item.product_name == '打官司') {
        if (item.money_type == 26) {
          params = {
            ...params,
            bearFees: '投资人支付(不用还)'
          };
        } else if (item.money_type == 27) {
          params = {
            ...params,
            bearFees: '自费',
			self_ident:item.self_ident,
			stage:item.stage,
          };
        }
        url = '/pages/client/order/order-court-own';
      } else if (item.product_name == '刑事会见') {
        url = '/pages/client/order/order-criminal';
      }
      this.jump(url, params);
    },
    previewImage(item) {
      let previewImages = [];
      let obj = {
        "userId" : "1234",
        "headIcon" : "",
        "nickname" : "风骚女子",
        "picURL" : item.product_image_max,
        "content" : item.title
      }
      previewImages.push(obj);
      this.newPreviewImages(previewImages);
    },
    copy(item) {
      if (!item.isEllipsis) {
        return;
      }
      let copyInfo = item.title;
      uniCopy({
        content: copyInfo,
        success: res => {
          uni.showToast({
            title: '文案复制成功',
            icon: 'none'
          });
        },
        error: e => {
          uni.showToast({
            title: e,
            icon: 'none',
            duration: 3000
          });
        }
      });
    },
    checkAll() {
      document.body.scrollTop = document.documentElement.scrollTop = 0;
    },
    gettopColor(){
      const nav = navigator.userAgent;
      if (nav.indexOf('Android') > -1 || nav.indexOf('Adr') > -1) {
        phone.setStatusBarColor("#ffffff")
      } else if (!!nav.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)) {
        this.$bridge.callhandler('backgroundColorChange', {topColor:'#ffffff',bottomColor:"#ffffff"}, res => {});
      }
    },
    //判断顶部颜色
    gettopNewColor(){
      const nav = navigator.userAgent;
      if (nav.indexOf('Android') > -1 || nav.indexOf('Adr') > -1) {
        phone.HomeMainPageBackgroundColorChange("#fafcfa")
      } else if (!!nav.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)) {
        this.$bridge.callhandler('HomeMainPageBackgroundColorChange', {topColor:'#fafcfa',bottomColor:"#fafcfa"}, res => {});
      }
    },
  },
  onPullDownRefresh(){
    console.log("=========this","--22222")
    this.initOnce();
    setTimeout(function () {
      uni.stopPullDownRefresh();
    }, 1000);
  },
  //加载更多
  onReachBottom() {
    this.loadData();
  }
};
</script>

<style lang="scss" scoped>
.content {
  padding-top: 176rpx;
  overflow-x:hidden!important;
}
.banner {

  margin-bottom: 10rpx;
  width: 100%;
  height: 100%;
  .image-wrapper {
    width: 100%;
    height: 100%;
    image {
      width: 100%;
      height: 100%;
    }
  }
}
.roll-box {
  background-color: #ffffff;
  padding: 0 0 0 50rpx;
  height: 100rpx;
  border-top: 1rpx solid #eee;
  border-bottom: 1rpx solid #eee;
  overflow: hidden;
  display: flex;
  align-items: center;
  .roll-left {
    width: 35rpx;
    height: 29rpx;
    margin-right: 20rpx;
    image {
      width: 100%;
      height: 100%;
    }
  }

  .roll-right {
    width: 120rpx;
    height: 30rpx;
    image {
      width: 100%;
      height: 100%;
    }
  }
}
.swiper {
  width: 100%;
  height: 100rpx;

  .swiper-item-txt {
    width: 100%;
    line-height: 100rpx;
  }
}
.coupons-index-box {
  margin: 0 auto;
  .coupons-txt {
    text-align: center;
    .txt-tip {
      font-size: 36rpx;
      font-weight: 900;
      background: linear-gradient(to right, #ffc261, #ffeca8);
      -webkit-background-clip: text;
      color: transparent;
    }
  }
  .item-txt {
    text-align: center;
    height:40rpx;
    font-size: 20rpx;
    margin: 0 auto;
    color: #ffffff;
    word-break:keep-all;/*不换行*/

    white-space:nowrap;/*不换行*/

    overflow:hidden;/*内容超出宽度时隐藏超出部分的内容*/

    text-overflow:ellipsis;/*当对象内文本溢出时显示省略标记(...)；需与overflow:hidden;一起使用。*/
  }
  .img1 {
    text-align: center;
    height: 40px;
    margin: 0 auto;
    image {
      width: 100%;
      height: 100%;
    }
  }
  .img2 {
    width: 376rpx;
    height: 260rpx;
    margin: 20rpx auto 0;
    image {
      width: 100%;
      height: 100%;
    }
  }
  .img3 {
    width: 200rpx;
    height: 60rpx;
    margin: 15rpx auto;
    image {
      width: 100%;
      height: 100%;
    }
  }
  .img4 {
    width: 40rpx;
    height: 40rpx;
    margin: 20rpx auto;
    image {
      width: 100%;
      height: 100%;
    }
  }
}
.user-index-con {
  padding: 100rpx 30rpx;
  .user-index-lit {
    width: 560rpx;
    margin: auto;
    .user-index-item {
      line-height: 60rpx;
      font-size: 24rpx;
    }
  }
}
.item-pro-name {
  text-align: center;
  margin-top: 20rpx;
}
::v-deep  .product-intro .tip-item {
  color: #333333;
}
::v-deep  .product-intro .tip-item.green {
  color: #2eab3b;
}
.notice-index-box {
  background-color: #ffffff;
  border-radius: 26rpx;
  display: flex;
  padding: 20rpx;
  margin: 20rpx 20rpx;
  .notice-index-left {
    flex: 1;
    .notice-index-item {
      position: relative;
      padding: 8rpx 20rpx;
      display: flex;
      align-items: center;
      &::before {
        content: '';
        position: absolute;
        left: 0;
        top: 50%;
        width: 10rpx;
        height: 10rpx;
        background-color: #acacac;
        border-radius: 50%;
        transform: translate(0, -50%);
      }
      .item-txt {
        flex: 1;
      }
      .item-time {
        font-size: 20rpx;
      }
    }
    .bottom-right {
      position: relative;
      padding: 12rpx 0px;
      display: flex;
      align-items: center;
      .item-txt{
        font-weight: bold;
        font-size: 30rpx;
      }
      .bottom-tip {
        color: #777;
        margin-right: 10rpx;
      }
      .item-time {
        display: flex;
        align-items: center;
        .lookmore{
          margin-right: 10rpx;
        }
        .rightarrow{
          display: flex;
          align-items: center;
          .bottom-raidus {
            border-radius: 50%;
            width: 16rpx;
            height: 16rpx;
            background-color: #f00;
            margin-right: 10rpx;
          }
          .bottom-arrow {
            width: 16rpx;
            image {
              width: 100%;
              height: 100%;
            }
          }
        }
      }

    }
  }

}
.index-rights {
  padding: 20rpx;
  background-color: #fafcfa;
  display: flex;
  align-items: center;
  .rights-txt {
    color: #bd272d;
    font-size: 24rpx;
    flex: 1;
  }
  .rights-img {
    height: 30rpx;
  }
}
.service-area-box {
  box-sizing: border-box;
  display: flex;
  flex-flow: wrap;
  justify-content: space-between;
  margin: 20rpx;
  padding:20rpx 16rpx 0;
  background: #fff;
  border-radius: 16rpx;

  .second-txt {
    display: flex;
    /* height: 29px; */
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    box-sizing: border-box;
    width:24%;

    &:nth-child(4n + 4) {
      margin-right: 0;
    }
    &.active {
      color: $uni-color-primary;
      border: 1rpx solid $uni-color-primary;
    }
    .area-image {
      display: block;
      width: 64rpx;
      height: 64rpx;
    }
    .area-txt {
      font-size: 28rpx;
      padding: 0 10rpx;
      line-height: 68rpx;

    }

  }
}
.swiper-banner {
  width: 710rpx;
  height: 190rpx;
  margin: 0 auto;
  border-radius: 20rpx;
  overflow: hidden;

}
// 瀑布流
::v-deep .vue-waterfall-column {
  float: left;
}

.cell-item {
  overflow: hidden;
  box-sizing: border-box;
  margin-bottom: 20rpx;
}

.item-img {
  overflow: hidden;
  position: relative;
  image {
    width: 100%;
    height: 100%;
  }
}
.item-txt {

  flex: 1;
  display: flex;
  flex-direction: column;
  min-width: 0;
  .item-money {
    //margin: 14rpx 0;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    .money-right {
      min-width: 94rpx;
      display: flex;
      align-items: center;
      image {
        width: 30rpx;
        height: 30rpx;
      }
      .money-num {
        font-size: 20rpx;
        margin-left: 6rpx;
        min-width: 100rpx;
        text-align: right;
      }
    }
  }

  .item-title {
    padding-top: 4rpx;
    display: flex;
    .title-image {
      margin-left: 16rpx;
      margin-bottom: 17rpx;
      margin-top: 4rpx;
      width: 40rpx;
      height: 40rpx;
      margin-right: 10rpx;
    }
    .title-txt {
      color: #aaa;
      font-size: 20rpx;
      flex: 1;
      line-height: 50rpx;
    }
    .title-arrow {
      padding-left: 10rpx;
      width: 26rpx;
      height: 50rpx;
      display: flex;
      align-items: center;
      image {
        width: 100%;
      }
      &.rotate {
        image {
          transform: rotate(180deg);
        }
      }
    }
  }
  .item-tip {
    //font-size: 24rpx;
    margin-bottom: 10rpx;
    .tip-item {
      margin-right: 10rpx;
    }
  }
  .item-tag {
    //margin-bottom: 4rpx;
    &.text-ellipsis {
      color: #aaa;
    }
    .tag-txt {
      //margin-left: 16rpx;
      color: #222222;
      margin-right: 2px;
      font-size: 28rpx;
    }
    .tag-txt-small {
      color: #333;
      transform: scale(0.75);
      transform-origin: 0 0;
      margin-left: -40rpx;
      &:first-child{
        margin-left: 0rpx;
      }
    }
    .label-txt-anzhuo-small {
      font-size: 28rpx;
      transform: scale(0.7) !important;
      transform-origin: 0 0;
    }

  }
  .item-give {
    color: #FF7521;
    font-size: 28rpx;
    font-weight: bold;
    width: 60%;
    //margin-left: 16rpx;
  }
  .item-fuhao {
    font-size: 22rpx;
  }

  .item-fq {
    font-size: 22rpx;
    margin-right: 4rpx;
  }
  .item-yuanshi{
    font-size: 30rpx;
    margin-right: 2rpx;
    margin-top: 2rpx;
  }
}
.txt-one-list {
  height: 50rpx;
  overflow: hidden;
}
.hot-box {
  padding: 40rpx 20rpx;
  .hot-title {
    margin-bottom: 20rpx;
    display: flex;
    align-items: center;
    .hot-fire {
      width: 30rpx;
      margin-right: 14rpx;
    }
    .hot-txt {
      font-size: 32rpx;
      font-weight: bold;
    }
  }
}
.txt-one-list {
  height: 50rpx;
  overflow: hidden;
}

.address{
  width: 346rpx;
  height: 42rpx;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-left: 16rpx;
  padding-right: 16rpx;
  position: absolute;
  bottom: 0rpx;
  left: 0rpx;
  background:linear-gradient(to bottom,rgba(0,0,0,0),rgba(0,0,0,1));
}
.address-v{
  width: 90rpx;
  height: 42rpx;
  display: flex;
  align-items: center;

  // justify-content: space-between;
}
.year-icon{
  width: 29rpx;
  height: 29rpx;
  display: flex;
  align-items: center;
  justify-content: center;
}
.year-icon image{
  width: 100%;
  height: 100%;
}
.year-name{
  font-size: 24rpx;
  font-family: PingFang SC;
  font-weight: bold;
  color: #FFFFFF;
  line-height: 42rpx;
}
.year-names{
  font-size: 24rpx;
  font-family: PingFang SC;
  font-weight: bold;
  color: #FFFFFF;
  line-height: 42rpx;
}

.address-icon{

  width: 20rpx;
  height: 29rpx;
  display: flex;
  align-items: center;
  justify-content: center;
}
.address-icon image{
  width: 100%;
  height: 100%;
}
.address-name{

  font-size: 24rpx;
  font-family: PingFang SC;
  font-weight: bold;
  color: #FFFFFF;
  line-height: 42rpx;

}
.service-list{
  margin-top:10px
}
::v-deep .item-img{
  height: 400rpx!important;
  overflow: hidden;
}
::v-deep .order-list-box .order-item{
  margin: 10px 10px 10px;
}
::v-deep .order-list-box .order-item .item-imgs {
  width: 60px;
  margin-right: 10px;
  height: auto!important;
}
::v-deep .order-list-box .order-item .item-img .image-wrapper uni-image{
  width: 60px;
  height: 60px;
}
.width60{
  width: 500px;
  overflow: hidden;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media (min-width: 391px) and (max-width: 430px){
  .width60{
    width: 284px;
  }
}
@media (min-width: 381px) and (max-width: 391px){
  .width60{
    width: 270px;
  }
}
@media (min-width: 321px) and (max-width: 380px){
  .width60{
    width: 250px;
  }
}
@media only screen and (max-width: 321px){
  .width60{
    width: 220px;
  }
}
.line_through{
  text-decoration: line-through;
  font-weight: normal;
  color:#aaa;
  font-size: 24rpx;
}

uni-page-body{
  background-color: #fafcfa;
  //background-color: #fff;
}


.line_through {
  text-decoration: line-through;
  font-weight: normal;
  color: #aaa;
  font-size: 22rpx;
}
.xia_a {
  white-space: nowrap;
  position: absolute;
  margin-left: -6rpx;
  margin-bottom: -10rpx;
  text-decoration: line-through;
  -webkit-transform: scale(0.75) !important;
  transform: scale(0.75) !important;
}

.xia_b {
  white-space: nowrap;
  position: absolute;
  // margin-top: -30rpx;
  margin-left: -6rpx;
  margin-bottom: -10rpx;
  // margin-right: 20rpx;
  text-decoration: line-through;
  // font-size: 4rpx;
  transform: scale(0.8) !important;
}

.xia_as {
  white-space: nowrap;
  position: absolute;
  margin-left: -6rpx;
  margin-bottom: -10rpx;
  text-decoration: line-through;
  -webkit-transform: scale(0.82) !important;
  transform: scale(0.82) !important;
}

.xia_bs {
  white-space: nowrap;
  position: absolute;
  // margin-top: -30rpx;
  margin-left: -6rpx;
  margin-bottom: -10rpx;
  // margin-right: 20rpx;
  text-decoration: line-through;
  // font-size: 4rpx;
  transform: scale(0.9) !important;
}
//.item-fq-larg {
//  margin-top: 2rpx;
//  transform: scale(0.9) !important;
//}
//.item-fq-small {
//  z-index: 9999;
//  transform: scale(0.75) !important;
//  margin-bottom: -10rpx;
//  margin-left: -16rpx;
//  // float: right;
//  // margin-right: -70rpx;
//  // margin-top: -35rpx;
//}
.teshus{
  font-size: 26rpx;
  margin-top: 4rpx;
}
.tops_10{
  margin-top: 2rpx;
}
.textnormal{
  text-decoration:none!important;
  font-size: 26rpx;
}
.item-gives{
  display: flex;
  flex-direction: column;
}
.item-img uni-image{
  width: 100%;
  height: 100%!important;
}
.sticky{
  position: fixed;
  top: 82rpx;
  z-index: 9;
  width: 100%;
}
.jiedanzhiyin{
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20rpx;
  margin: 10px 10px 10px;
  background: #ffffff;
  border-radius: 5px;
  .jiedan_left{
    display: flex;
    align-items: center;
    .jiedan-img{
      width: 100rpx;
      height: 100rpx;
      border-radius: 50%;
      margin-right: 20rpx;
    }
    .jiedan-top{
      font-size: 30rpx;
      font-family: PingFangSC-Medium, PingFang SC;
      font-weight: 600;
      color: #111111;
      line-height: 21px;
    }
    .jiedan-subtitle{
      color: #111111;
      line-height: 26px;
    }
  }
  .jiedan_right{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 55px;
    height: 30px;
    background: #FAFAFA;
    border-radius: 13px;
    color: #FDC902;
  }
}
//加载款样式
.loading-run{
  height: 320rpx;
  width: 400rpx;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  .loading-gif{
    width: 80rpx;
    height: 80rpx;
    margin-bottom:60rpx;
  }
  .loading-gif-fail,.loading-gif-success{
    width: 120rpx;
    height: 170rpx;
    margin-bottom:20rpx;
  }
  .loading-text{
    font-size: 32rpx;
    font-family: PingFangSC-Regular, PingFang SC;
    font-weight: 400;
    color: #111111;
    line-height: 46rpx;
  }
}
.dialog-toast{
  width:440rpx!important ;
}
.dialog-toast-loading{
  width:380rpx!important ;
}
</style>
